<template>
  <el-upload
    class="upload-demo"
    action=""
    :auto-upload="false"
    :on-change="uploadChange"
    :limit="1"
  >
    <div class="el-upload__text">导入</div>
  </el-upload>
</template>
<script>
import { addTable } from "../../../utils/api/f_request";
import * as XLSX from "xlsx";
import { readFile } from "../../../utils/api/readFile"; //下⽂有该⽂件代码
export default {
  name: "upload",
  methods: {
    async uploadChange(file) {
      let dataBinary = await readFile(file.raw);
      let workBook = XLSX.read(dataBinary, { type: "binary", cellDates: true });
      let workSheet = workBook.Sheets[workBook.SheetNames[0]];
      const tableData = XLSX.utils.sheet_to_json(workSheet);
      if (tableData != null) {
        addTable(tableData).then((data) => {
          console.log(data);
        });
      } else {
        console.log("未上传内容");
      }
    },
  },
};
</script>
<style lang="scss" scoped>
.upload-demo {
  width: 120px;
  height: 50px;
  background-color: #dbebff;
  text-align: center;
  color: #2684ff;
  margin-right: 2%;
  border-radius: 5%;
  cursor: pointer;
}
.el-upload__text {
  width: 120px;
  height: 50px;
  line-height: 50px;
}
.upload-demo:hover {
  background-color: red;
  color: #fff;
}
</style>
